<style scoped lang='scss'>
  @import "../../assets/scss/login.scss";
</style>
<template>
    <Form ref="formInline" :model="formInline" :rules="ruleInline" inline class="login-form">
        <Row>
            <Col span="24">
                <div class="login-title">
                    Matrix
                </div>
            </Col>
        </Row>
        <Row>
            <Col span="24">
                <FormItem prop="user">
                    <Input type="text" v-model="formInline.user" placeholder="请输入用户名" size="large" class="login-input">
                        <Icon type="ios-person-outline" slot="prepend"></Icon>
                    </Input>
                </FormItem>
            </Col>
        </Row>
        <Row>
            <Col span="24">
                <FormItem prop="password">
                    <Input type="password" v-model="formInline.password" placeholder="请输入密码" size="large" class="login-input" @keyup.enter.native="handleSubmit('formInline')">
                        <Icon type="ios-locked-outline" slot="prepend"></Icon>
                    </Input>
                </FormItem>
            </Col>
        </Row>
        <Row>
            <Col span="24">
                <div class="login-tooltip">
                    <Tooltip placement="top" class="info-icon">
                        <Icon type="ios-information-outline"></Icon>
                        <div slot="content">
                            请使用<span class="red">Beetle系统</span>账号密码登录！
                        </div>
                    </Tooltip>
                    
                    <Tooltip placement="top" class="info-text">
                        忘记密码？
                        <div slot="content">
                            <div>默认账号为：<span class="red">邮箱前缀</span></div>
                            <div>默认密码为：<span class="red">888888（6个8）</span></div>
                            <div>登录工程中，如有其它问题，请联系管理员。</div>
                        </div>
                    </Tooltip>

                </div>
            </Col>
        </Row>
        <Row>
            <Col span="24">
                <Button type="primary" class="login-btn" @click="handleSubmit('formInline')">登录</Button>
            </Col>
        </Row>
        <Row>
            <Col span="24">
                <div class="login-info">Copyright © 2018 Winit 研发中心 系统工程部</div>
            </Col>
        </Row>
    </Form>
</template>
<script>
    import ActionUrl from '../../assets/js/data/action.url.js';
    import Utility from '../../assets/js/utilities/utility.js';
    export default {
        data () {
            return {
                formInline: {
                    user: '',
                    password: ''
                },
                ruleInline: {
                    user: [
                        { required: true, message: '请输入用户名', trigger: 'blur' }
                    ],
                    password: [
                        { required: true, message: '请输入密码', trigger: 'blur' },
                        { type: 'string', min: 1, message: '密码长度必须大于1位', trigger: 'blur' }
                    ]
                }
            }
        },
        mounted: function() {
            
        },
        methods: {
            handleSubmit(name) {
                let actionUrl = Utility.stringFormat(ActionUrl.user.login.url, this.$refs[name].model.user, this.$refs[name].model.password);
                this.$http.get(actionUrl).then(result => {
                    if(result.body.success) {
                        sessionStorage.setItem("tokenId", result.body.data.token_id);
                        this.getUserInfoByTokenId(result.body.data.token_id);
                        let redirect = decodeURIComponent(this.$route.query.redirect || '/matrix');
                        this.$router.push({ path: redirect }) 
                    } else {
                        this.$Message.error('登录失败，用户名或密码错误！');
                    }
                });
            },
            getUserInfoByTokenId(tokenId) {
                let self = this;
                let url = Utility.stringFormat(ActionUrl.user.getUserInfoByTokenId.url, tokenId);
                self.$http.get(url).then(result => {
                    if(result.body.success) {
                        sessionStorage.setItem("userInfo", Utility.toJsonString(result.body.data));
                        self.$store.dispatch('actionUserInfo', result.body.data);
                    } else {
                        self.$Message.error('获取登录用户信息错误！');
                    }
                });
            }
        }
    }
</script>